<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<html>
			<head>
				<meta charset="utf-8">
				<title></title>
		
				<script src="https://unpkg.com/vue@3/dist/vue.global.js"></script>
			</head>
			<body>
				<div id="app">
					
					{{message}}<br />
					{{index+1}}<br />
					{{isMarried?"已婚":"未婚"}}<br />
					{{scores[0]}}<br />
					{{student.name}}{{student.age}}<br />
					{{stus[2].name}}{{stus[2].age}}<br />
				</div>
				
				<script>
					var app = Vue.createApp({
						// 1. data用来设置模型数据
						data() {
							return {
								message: "Hello Vue!",
								index:0,
								isMarried:true,
								scores:[99,81,65,77,100],
								student:{name:'张三',age:18},
								stus:[
									{name:'刘备',age:40},
									{name:'关羽',age:38},
									{name:'张飞',age:32}
								]
							}
						}
					});
					var vm = app.mount("#app")
				</script>
		
		
		
			</body>
		</html>
	</body>
</html>